<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>全部订单</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script src="js/rem.js"></script>
    <script src="js/vue-2.4.0.js"></script>
    <script src="js/axios_v0.12.0.js"></script>
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css/base.css"/>
    <link rel="stylesheet" type="text/css" href="css/page.css"/>
    <link rel="stylesheet" type="text/css" href="css/all.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loading.css"/>
</head>
<!--loading页开始-->
<div class="loading">
    <div class="loader">
        <div class="loader-inner pacman">
            <div></div>
            <div></div>
            <div></div>
            <div></div>
            <div></div>
        </div>
    </div>
</div>
<!--loading页结束-->
<body>
<header class="mui-bar mui-bar-nav report-header box-s" id="header">
    <a href="center.html"><i class="iconfont icon-fanhui fl"></i></a>
    <p>全部订单</p>
</header>
<div id="main" class="mui-clearfix">
    <div class="order-top clearfloat">
        <ul>
            <li class="clearfloat "><a href="order.html">全部</a></li>
            <li class="clearfloat"><a href="#" onclick="chooseStatus(0)">待付款</a></li>
            <!--            <li class="clearfloat"><a href="#" onclick="chooseStatus(1)">待发货</a></li>-->
            <li class="clearfloat"><a href="#" onclick="chooseStatus(2)">待收货</a></li>
            <li class="clearfloat"><a href="#" onclick="chooseStatus(3)">待评价</a></li>
            <li class="clearfloat"><a href="#" onclick="chooseStatus(4)">已退货</a></li>
            <li class="clearfloat"><a href="#" onclick="chooseStatus(5)">已评价</a></li>

        </ul>
    </div>
</div>
<div id="orderBody">
    <div v-for="order in orders" class="order-list clearfloat">
        <p class="ordernum box-s">
            订单 {{order.orderCode}}
            <span v-if="order.status==0">待付款</span>
            <!--            <span v-if="order.status==1">待发货</span>-->
            <span v-if="order.status==2">待收货</span>
            <span v-if="order.status==3">待评价</span>
            <span v-if="order.status==4">已退货</span>
            <span v-if="order.status==5">已评价</span>
            <span v-if="order.payStyle==0">微信付款</span>
            <span v-if="order.payStyle==1">易支撑付款</span>
            <span v-if="order.payStyle==2">积分付款</span>
            <span v-if="order.payStyle==3">钱包现金支付</span>
        </p>
        <div id="orderStatus" style="visibility:hidden">{{order.status}}</div>


        <div v-for="item in order.orderItems" class="list clearfloat fl box-s">
            <a href="detail.html">
                <div class="tu fl clearfloat">
                    <img id="image" :src="item.image+'1_big.png'"/>
                </div>
                <div class="middle clearfloat fl">
                    <p class="tit">订单时间：{{item.createdTimes}}</p>
                    <p class="tit">{{item.title}}</p>
                    <p class="fu-tit">{{item.sellPoint}}</p>
                    <p class="price clearfloat">
                        <span class="xprice fl">{{item.price}}</span>
                        <span class="yprice fl">{{item.realPrice}}</span>
                        <span class="shu">×{{item.num}}</span>
                    </p>
                </div>
            </a>
        </div>
        <p class="price clearfloat">
            <span class="xprice fl">订单总价：{{order.price}}</span>
        </p>
        <a v-if="order.status==0" @click="createOrder(order.orderCode,order.price,order.id)" href="#"
           class="gopay-btn fr">
            立即支付
        </a>
        <a v-if="order.status==2" @click="retuenOrder(order.id,order.payStyle)" href="#" class="gopay-btn fr">
            商品退货
        </a>
        <a v-if="order.status==2" @click="okOrder(order.id,3,order.payStyle)" href="#" class="gopay-btn fr">
            确认收货
        </a>
        <a v-if="order.status==3" @click="assessOrder(order.id)" href="#" class="gopay-btn fr">
            商品评价
        </a>
        <a v-if="order.status==5" @click="lookAssess(order.id,2)" href="#" class="gopay-btn fr">
            查看评价
        </a>
    </div>

</div>


<style type="text/css">
    .more-btn {
        width: 25%;
        padding: 3% 0;
        text-align: center;
        background-color: #00CC7D;
        color: #fff;
        font-size: .5rem;
        margin: 5% auto;
    }
</style>
<!--<a href="#" class="more-btn db ra5">更多</a>-->
</div>
</body>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script src="js/mui.min.js"></script>
<script type="text/javascript" src="js/hmt.js"></script>
<script type="text/javascript">
    var orderListUrl = "../orders/list";
    var changeStatusUrl = "../orders/changeStatus";
    var returnOrderUrl ="../orders/returnOrder";


    $(function () {
        $(".loading").addClass("loader-chanage")
        $(".loading").fadeOut(300)
        initOrderList()
    })

    function initOrderList() {
        $.get(orderListUrl, function (result) {
            if (result.state == 1000) {
                new Vue({
                    el: '#orderBody',
                    data: {
                        orders: result.data,

                    }, methods: {
                        createOrder: function (orderCode, price, oid) {
                            window.location.href = "submit-order.html?" + orderCode + "," + price + "," + oid;
                        },
                        assessOrder: function (orderCode) {
                            window.location.href = "assess.html?" + orderCode ;
                        },
                        lookAssess: function (orderCode,flag) {
                            window.location.href = "assess.html?" + orderCode +","+flag;
                        },
                        okOrder: function (oid, status, paystyle) {
                            //修改订单状态为待评价
                            var params = {
                                status: status,
                                oid: oid,
                                payStyle: paystyle
                            }

                            $.post(changeStatusUrl, params, function (result) {
                                if (result.state == 1000) {
                                    alert("已确认收货，请及时评价");
                                    chooseStatus(4);//跳转评价页面
                                } else {
                                    alert(result.msg);
                                }
                            })
                        },
                        retuenOrder: function (oid,payStyle) {
                            var param = {oid: oid};
                            $.post(returnOrderUrl, param, function (result) {
                                if (result.state == 1000) {
                                    if(payStyle==0) {
                                        alert("退货成功，微信支付款已退回钱包余额中");
                                        window.location.href = "account.html";
                                    }
                                    if(payStyle==1) {
                                        alert("退货成功，翼支付支付款已退回钱包余额中");
                                        window.location.href = "account.html";
                                    }
                                    if(payStyle==2) {
                                        alert("退货成功，积分已返回");
                                        window.location.href = "jfguanli.html";

                                    }
                                    if(payStyle==3) {
                                        alert("退货成功，线上钱包支付款已返回钱包余额中");
                                        window.location.href = "account.html";

                                    }
                                } else {
                                    alert(result.msg);
                                }
                            })
                        }
                    },
                });
            } else if (result.state == 2007) { // 未找到记录
                alert("您还未生成订单，促销火热进行中，请到商品页面选购~");
                $("#orderBody").empty();
            } else {
                alert(result.msg);
                $("#orderBody").empty();
            }
        })
    }

    function chooseStatus(status) {
        window.location.href = "re-order.html?" + status;
    }
</script>
</html>
